<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Home</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700" rel="stylesheet" type="text/css" />
<link href="default.css" rel="stylesheet" type="text/css" media="all" />
<link href="themes/2/js-image-slider.css" rel="stylesheet" type="text/css" />
	<jsp:useBean id="beans" class="beans.LoginBean" scope="page" />
 <script src="themes/2/js-image-slider.js" type="text/javascript"></script>
<!--[if IE 6]>
<link href="default_ie6.css" rel="stylesheet" type="text/css" />
<![endif]-->
</head>
<body>
<div id="wrapper">
	<div id="header">
		<div id="logo">
		<a href ="index.jsp">
			<img src="images/tea_logo.jpg" alt ="Totalitea Logo" align="left" width="150px" height="150px" />
		</a>
			<br />
			<br />
			<img src="images/transparent_text_effect.png" alt="Totalitea Title" align="left" width="420px" height="150px"/>
			<div id="Login_Search">
				<div id="login">
				<fieldset>
					<legend>Login</legend>
					<form action="LoginServlet" METHOD="GET" name="loginForm">
					<input type="hidden" name="page" value="1"/>
						<p>
							Username : <input type="text" name="userName" />
						<br />
							Password &nbsp;: <input type="password" name="passWord"/>
						</p>
						<span style="float:right; margin-right:2%;">
							<input type="submit" value="Login" />
						</span>
			<% 
			String username = (String) request.getSession().getAttribute("userName"); 
			String password = (String) request.getSession().getAttribute("passWord");
			
			if((username != null && !username.isEmpty()) || (password != null && !password.isEmpty()))
			{
				if (!beans.isLoginValid(username, password)) {
				%><span>Invalid Login</span><%
				}
				/*username = "";
				password = "";*/
			} %>
					</form>
				</fieldset>
				</div>
				<br />
				<br />
			</div>
		</div>
	</div>
	<!-- end #header -->
	<div id="menu">
		<ul>
			<li class="current_page_item"><a href="index.jsp">Home</a></li>
			<li><a href="Login.jsp">Login</a></li>
			<li><a href="Search_Results.jsp">Search</a></li>
			<li><a href="Basket.jsp">Basket</a></li>
			<li class="last"><a href="#">Contact Us</a></li>		
		</ul>
	</div>
	<div id="container">
		<div id="underthemenu">
				<div id="search">
					<form action="SearchServlet" METHOD="GET" name="page1form">
						<input type="hidden" name="page" value="1">
						<input type="text" name="searchTerm"> <select
							name="searchOption">
						<option value="0">Description</option>
						<option value="1">Category</option>
						</select>
							<input type="image" value="submit" src="images/search.png" alt="Search" />
					</form>
				</div>
		</div>	
		    <div id="sliderFrame">
		        <div id="slider">
		            <a class="lazyImage" href="images/tea32.jpg" title="Finest Sencha">Testing</a>
		            <a class="lazyImage" href="images/tea33.jpg" title="Lipton Teapot">Pure JavaScript</a>
		            <a class="lazyImage" href="images/tea34.jpg" title="Lipton Green Tea">Image Slider</b></a>
		            <a class="lazyImage" href="images/tea35.jpg" title="Mao Feng">Slide 4</a>
		        </div>
		        <!--thumbnails-->
		        <div id="thumbs">
		            <div class="thumb">
		                <div class="frame"><img src="images/tea32_thumb.jpg" /></div>
		                <div class="thumb-content"><p>Calming</p>Finest Sencha</div>
		                <div style="clear:both;"></div>
		            </div>
		            <div class="thumb">
		                <div class="frame"><img src="images/tea33_thumb.jpg" /></div>
		                <div class="thumb-content"><p>Stylish</p>The perfect gift</div>
		                <div style="clear:both;"></div>
		            </div>
		            <div class="thumb">
		                <div class="frame"><img src="images/tea34_thumb.jpg"  /></div>
		                 <div class="thumb-content"><p>Delicious</p>Tastiest in the world</div>
		                <div style="clear:both;"></div>
		            </div>
		            <div class="thumb">
		                <div class="frame"><img src="images/tea35_thumb.jpg"  /></div>
		                <div class="thumb-content"><p>Soothing</p>Calm down after a long day</div>
		                <div style="clear:both;"></div>
		            </div>
		        </div>
		        <!--clear above float:left elements. It is required if above #slider is styled as float:left. -->
		        <div style="clear:both;height:0;"></div>
		    </div>
		</div>
		<br />
	</div>
<div id="footer">
	<p>Copyright&copy; 2013 Totalitea.com. All rights reserved.&trade;</p>
</div>
</body>
</html>
